import { Component, ElementRef, Renderer2, ViewChild } from '@angular/core';
import { ApiService } from '@core/services/http/api.service';
import { EditorOptListComponent } from "@shared/ag-grid-ext/cell-editors/edit-opt-list.component";
import { ApesField } from "@shared/ui-zorro/src/types/apes-field";
import { ExpressionService } from "@core/services/expression/ExpressionService";
import { Events } from "@core/services/events/Events";
import { SubjectService } from "@core/services/events/subject.service";
import { Tree } from '@shared/apes/tree-display/tree';
import { deepClone } from "../../../../utils/utils";
import {GridConfigService} from "@core/config/grid-config.service";
import { Module } from '@ag-grid-community/core';
import { AllModules } from '@ag-grid-enterprise/all-modules';

// export interface operation {
//   menu_id:any,
//   label:any,
//   value:any,
//   operationId:any,
//   checked:any,
// }
@Component({
  selector: 'formly-field-role-check-pz-redundancy',
  template: `
      <div apes-col style='padding:0 !important;' [apesMd]='24'>
          <apes-form-item style='padding:0 !important;'>
              <div style="height: 560px;">
                  <ag-grid-angular
                          #agGrid
                          style="width: 100%; height: 100%;"
                          id="myGrid"
                          class="ag-theme-balham"
                          [columnDefs]="columnDefs"
                          [rowData]="_rowData"
                          [modules]="modules"
                          [suppressRowClickSelection]="true"
                          [groupSelectsChildren]="true"
                          [autoGroupColumnDef]="autoGroupColumnDef"
                          (rowClicked)="onRowClicked($event)"
                          (rowSelected)="onRowSelected($event)"
                          (gridReady)="onGridReady($event)"
                          [defaultColDef]="colDef"
                          [rowSelection]="selection"
                  ></ag-grid-angular>
              </div>
          </apes-form-item>
      </div>
  `
})
/*界面分隔线 [apesCheckable]="!to.disabled"*/

export class FormlyFieldCheckPzOptRedundancy extends ApesField {
  modules: Module[] =AllModules;

  metaData: any = [];
  value: any = [];
  select: any = [];
  columnDefs: any;
  gridApi;
  gridColumnApi;
  frameworkComponents;
  autoGroupColumnDef;
  localeText: any;
  private enable = false;
  colDef : any = [];
  selection : any = [];
  _rowData: any = [];

  constructor(protected apiService: ApiService,
              protected events: Events,
              protected expressionService: ExpressionService,
              protected elementRef: ElementRef,
              protected renderer: Renderer2,
              protected subjectService: SubjectService,
              protected gridConfigService: GridConfigService) {
    super(apiService, events, expressionService, subjectService);
    this.localeText = gridConfigService.getLocaleText();
    this.columnDefs = [
      {
        field: 'companyName',
        rowGroup: true,
        hide: true,
      },
      {
        field: 'branchName',
        rowGroup: true,
        hide: true,
      },
      {
        field: "ip",
        headerName:"登录IP地址",
      },
      {
        field: "postName",
        headerName:"登录角色",
      },
      {
        field: "create",
        headerName:"最近登录时间",
      },
    ];
    this.colDef = {
      flex: 1,
      minWidth: 100,
    };
    this.autoGroupColumnDef = {
      headerName: '用户',
      field: 'userName',
      minWidth: 250,
      cellRenderer: 'agGroupCellRenderer',
      cellRendererParams: { checkbox: true },
    };
    this.selection = 'multiple';
    // this.columnDefs = [
    //   {field: "id", hide:"true"}, {field: "name",hide:"true"},{field: "postName", headerName:"登录角色", filter:true},
    //   {field: "ip", headerName:"登录IP地址", filter:true},{field: "create", headerName:"最近登录时间", filter:true}
    // ];

    // this.frameworkComponents = {
    //   platformSystemOptList: EditorOptListComponent,
    // }
    // this.groupDefaultExpanded = -1;
    // this.getDataPath = (data) => {
    //   return data.path.split('/');
    // };
    // this.autoGroupColumnDef = {
    //   headerName: "列表",
    //   resizable:true,
    //   cellRendererParams: {
    //     innerRenderer: (params) => {
    //       return params.data.name;
    //     },
    //     checkbox: true,
    //   }
    // };
  }

  onGridReady(params) {
    this.gridApi = params.api;
    this.gridColumnApi = params.columnApi;

    params.api.sizeColumnsToFit();
  }

  ngOnInit(): void {
    let data = {'terminalTypeId': "platformSystem"};
    this.apiService.post("aut.onlineUsersService.getTreePath", {'body': JSON.stringify(data)}).subscribe(
      (body) => {
        if (body) {
          this.value = body;
          this.metaData = body;
          this._rowData = body;
        }
      });
    this.subject.subscribe(this.formState, this.subject.event_form_button, data => {
      let disabled = this.formState.states=="submit" ? false:true;
      this.enable = !disabled;
      this.columnDefs = [{field: "id",hide:"true"}, {field: "name",hide:"true"},{field: "postName", headerName:"登录角色", filter:true},
        {field: "ip", headerName:"登录IP地址", filter:true},{field: "create", headerName:"最近登录时间", filter:true}];
      if (data.action=="action_submit"){
        this.patchValue();
      }
    });

  }

  //点击checkbox触发事件
  onRowSelected(params) {
    if (params.node.data != undefined) {
      params.node.data.checked = params.node.selected;
    }
    this.patchValue();
  }
  patchValue(){
    let returnData =[];
    this.value.forEach(item =>{
      if(item.checked){
        returnData.push(item);
      }
    })
    this.formControl.patchValue(returnData);
    this.model["platformSystemOptList"] = returnData;
  }

  onRowClicked(params) {
  }
}
